<!DOCTYPE html><html lang="zh-CN" data-theme="dark"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><title>个人简历大全 😘 | 前端攻城狮ZhuoRu</title><meta name="keywords" content="张卓如,web,前端,简历，技能"><meta name="author" content="ZhuoRu"><meta name="copyright" content="ZhuoRu"><meta name="format-detection" content="telephone=no"><meta name="theme-color" content="#0d0d0d"><meta name="baidu-site-verification" content="code-0ABMo98myg"><meta name="description" content="2022年前端内卷版简历大全">
<meta property="og:type" content="article">
<meta property="og:title" content="个人简历大全 😘">
<meta property="og:url" content="https://zhangzhuoru.gitee.io/web/post/1666.html">
<meta property="og:site_name" content="前端攻城狮ZhuoRu">
<meta property="og:description" content="2022年前端内卷版简历大全">
<meta property="og:locale" content="zh_CN">
<meta property="og:image" content="https://zhangzhuoru.gitee.io/web/img/tab4.png">
<meta property="article:published_time" content="2022-11-26T16:31:04.810Z">
<meta property="article:modified_time" content="2022-06-22T16:27:23.000Z">
<meta property="article:author" content="ZhuoRu">
<meta property="article:tag" content="优秀简历">
<meta name="twitter:card" content="summary">
<meta name="twitter:image" content="https://zhangzhuoru.gitee.io/web/img/tab4.png"><link rel="shortcut icon" href="/web/img/favicon.png"><link rel="canonical" href="https://zhangzhuoru.gitee.io/web/post/1666"><link rel="preconnect" href="//cdn.jsdelivr.net"/><link rel="preconnect" href="//busuanzi.ibruce.info"/><link rel="stylesheet" href="/web/css/index.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free/css/all.min.css" media="print" onload="this.media='all'"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/node-snackbar/dist/snackbar.min.css" media="print" onload="this.media='all'"><script>const GLOBAL_CONFIG = { 
  root: '/web/',
  algolia: undefined,
  localSearch: {"path":"search.xml","languages":{"hits_empty":"找不到您查询的内容：${query}"}},
  translate: undefined,
  noticeOutdate: undefined,
  highlight: {"plugin":"highlighjs","highlightCopy":true,"highlightLang":true,"highlightHeightLimit":500},
  copy: {
    success: '复制成功',
    error: '复制错误',
    noSupport: '浏览器不支持'
  },
  relativeDate: {
    homepage: false,
    post: false
  },
  runtime: '天',
  date_suffix: {
    just: '刚刚',
    min: '分钟前',
    hour: '小时前',
    day: '天前',
    month: '个月前'
  },
  copyright: {"limitCount":50,"languages":{"author":"作者: ZhuoRu","link":"链接: ","source":"来源: 前端攻城狮ZhuoRu","info":"著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。"}},
  lightbox: 'fancybox',
  Snackbar: {"chs_to_cht":"你已切换为繁体","cht_to_chs":"你已切换为简体","day_to_night":"你已切换为深色模式","night_to_day":"你已切换为浅色模式","bgLight":"#49b1f5","bgDark":"#121212","position":"top-right"},
  source: {
    jQuery: 'https://cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js',
    justifiedGallery: {
      js: 'https://cdn.jsdelivr.net/npm/justifiedGallery/dist/js/jquery.justifiedGallery.min.js',
      css: 'https://cdn.jsdelivr.net/npm/justifiedGallery/dist/css/justifiedGallery.min.css'
    },
    fancybox: {
      js: 'https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@latest/dist/jquery.fancybox.min.js',
      css: 'https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@latest/dist/jquery.fancybox.min.css'
    }
  },
  isPhotoFigcaption: true,
  islazyload: true,
  isanchor: false
}</script><script id="config-diff">var GLOBAL_CONFIG_SITE = { 
  isPost: true,
  isHome: false,
  isHighlightShrink: false,
  isToc: true,
  postUpdate: '2022-06-23 00:27:23'
}</script><noscript><style type="text/css">
  #nav {
    opacity: 1
  }
  .justified-gallery img {
    opacity: 1
  }

  #recent-posts time,
  #post-meta time {
    display: inline !important
  }
</style></noscript><script>(win=>{
    win.saveToLocal = {
      set: function setWithExpiry(key, value, ttl) {
        if (ttl === 0) return
        const now = new Date()
        const expiryDay = ttl * 86400000
        const item = {
          value: value,
          expiry: now.getTime() + expiryDay,
        }
        localStorage.setItem(key, JSON.stringify(item))
      },

      get: function getWithExpiry(key) {
        const itemStr = localStorage.getItem(key)

        if (!itemStr) {
          return undefined
        }
        const item = JSON.parse(itemStr)
        const now = new Date()

        if (now.getTime() > item.expiry) {
          localStorage.removeItem(key)
          return undefined
        }
        return item.value
      }
    }
  
    win.getScript = url => new Promise((resolve, reject) => {
      const script = document.createElement('script')
      script.src = url
      script.async = true
      script.onerror = reject
      script.onload = script.onreadystatechange = function() {
        const loadState = this.readyState
        if (loadState && loadState !== 'loaded' && loadState !== 'complete') return
        script.onload = script.onreadystatechange = null
        resolve()
      }
      document.head.appendChild(script)
    })
  
      win.activateDarkMode = function () {
        document.documentElement.setAttribute('data-theme', 'dark')
        if (document.querySelector('meta[name="theme-color"]') !== null) {
          document.querySelector('meta[name="theme-color"]').setAttribute('content', '#0d0d0d')
        }
      }
      win.activateLightMode = function () {
        document.documentElement.setAttribute('data-theme', 'light')
        if (document.querySelector('meta[name="theme-color"]') !== null) {
          document.querySelector('meta[name="theme-color"]').setAttribute('content', '#ffffff')
        }
      }
      const t = saveToLocal.get('theme')
    
          if (t === 'dark') activateDarkMode()
          else if (t === 'light') activateLightMode()
        
      const asideStatus = saveToLocal.get('aside-status')
      if (asideStatus !== undefined) {
        if (asideStatus === 'hide') {
          document.documentElement.classList.add('hide-aside')
        } else {
          document.documentElement.classList.remove('hide-aside')
        }
      }
    })(window)</script><link rel="stylesheet" href="./css/custom.css"><link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/tzy13755126023/BLOG_SOURCE/css/function.min.css"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" media="defer" onload="this.media='all'"><link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/l-lin/font-awesome-animation/dist/font-awesome-animation.min.css"  media="defer" onload="this.media='all'"><svg aria-hidden="true" style="position:absolute; overflow:hidden; width:0; height:0"><symbol id="icon-sun" viewBox="0 0 1024 1024"><path d="M611.370667 167.082667a445.013333 445.013333 0 0 1-38.4 161.834666 477.824 477.824 0 0 1-244.736 244.394667 445.141333 445.141333 0 0 1-161.109334 38.058667 85.077333 85.077333 0 0 0-65.066666 135.722666A462.08 462.08 0 1 0 747.093333 102.058667a85.077333 85.077333 0 0 0-135.722666 65.024z" fill="#FFB531" p-id="11345"></path><path d="M329.728 274.133333l35.157333-35.157333a21.333333 21.333333 0 1 0-30.165333-30.165333l-35.157333 35.157333-35.114667-35.157333a21.333333 21.333333 0 0 0-30.165333 30.165333l35.114666 35.157333-35.114666 35.157334a21.333333 21.333333 0 1 0 30.165333 30.165333l35.114667-35.157333 35.157333 35.157333a21.333333 21.333333 0 1 0 30.165333-30.165333z" fill="#030835" p-id="11346"></path></symbol><symbol id="icon-moon" viewBox="0 0 1024 1024"><path d="M611.370667 167.082667a445.013333 445.013333 0 0 1-38.4 161.834666 477.824 477.824 0 0 1-244.736 244.394667 445.141333 445.141333 0 0 1-161.109334 38.058667 85.077333 85.077333 0 0 0-65.066666 135.722666A462.08 462.08 0 1 0 747.093333 102.058667a85.077333 85.077333 0 0 0-135.722666 65.024z" fill="#FFB531" p-id="11345"></path><path d="M329.728 274.133333l35.157333-35.157333a21.333333 21.333333 0 1 0-30.165333-30.165333l-35.157333 35.157333-35.114667-35.157333a21.333333 21.333333 0 0 0-30.165333 30.165333l35.114666 35.157333-35.114666 35.157334a21.333333 21.333333 0 1 0 30.165333 30.165333l35.114667-35.157333 35.157333 35.157333a21.333333 21.333333 0 1 0 30.165333-30.165333z" fill="#030835" p-id="11346"></path></symbol></svg><!-- hexo injector head_end start --><link rel="stylesheet" href="https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper.min.css" media="print" onload="this.media='all'"><link rel="stylesheet" href="https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiperstyle.css" media="print" onload="this.media='all'"><link rel="stylesheet" href="https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/assets/font-awesome-animation.min.css" media="defer" onload="this.media='all'"><link rel="stylesheet" href="https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/tag_plugins.css" media="defer" onload="this.media='all'"><script src="https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/assets/carousel-touch.js"></script><!-- hexo injector head_end end --><meta name="generator" content="Hexo 5.4.2"></head><body><div id="loading-box"><div class="pokeball-back"></div><div class="pokeball-loading"><div class="pokeball" id="pokeball-normal"></div><div class="pokeball" id="pokeball-great"></div><div class="pokeball" id="pokeball-ultra"></div><div class="pokeball" id="pokeball-master"></div><div class="pokeball" id="pokeball-safari"></div></div></div><div id="web_bg"></div><div id="sidebar"><div id="menu-mask"></div><div id="sidebar-menus"><div class="author-avatar"><img class="avatar-img" data-lazy-src="https://thirdqq.qlogo.cn/g?b=sdk&amp;nk=2276839311&amp;s=140" onerror="onerror=null;src='/img/friend_404.gif'" alt="avatar"/></div><div class="site-data"><div class="data-item is-center"><div class="data-item-link"><a href="/web/archives/"><div class="headline">文章</div><div class="length-num">8</div></a></div></div><div class="data-item is-center"><div class="data-item-link"><a href="/web/tags/"><div class="headline">标签</div><div class="length-num">9</div></a></div></div><div class="data-item is-center"><div class="data-item-link"><a href="/web/categories/"><div class="headline">分类</div><div class="length-num">5</div></a></div></div></div><hr/><div class="menus_items"><div class="menus_item"><a class="site-page" href="/web/"><i class="fa-fw fas fa-home"></i><span> 首页</span></a></div><div class="menus_item"><a class="site-page" href="/web/archives/"><i class="fa-fw fa fa-graduation-cap"></i><span> 博文</span></a></div><div class="menus_item"><a class="site-page" href="/web/sponsorWall/"><i class="fa-fw fas fa-images"></i><span> 赞助墙</span></a></div><div class="menus_item"><a class="site-page" href="/web/comment/"><i class="fa-fw fa fa-paper-plane"></i><span> 留言板</span></a></div><div class="menus_item"><a class="site-page" href="/web/link/"><i class="fa-fw fas fa-link"></i><span> 友链</span></a></div><div class="menus_item"><a class="site-page" href="/web/about/"><i class="fa-fw fas fa-heart"></i><span> 关于</span></a></div><div class="menus_item"><a class="site-page" href="/web/other/"><i class="fa-fw fas fa-coffee"></i><span> Demo</span></a></div></div></div></div><div class="post" id="body-wrap"><header class="post-bg" id="page-header" style="background-image: url('/web/img/tab4.png')"><nav id="nav"><span id="blog_name"><a id="site-name" href="/web/">前端攻城狮ZhuoRu</a></span><div id="menus"><div id="search-button"><a class="site-page social-icon search"><i class="fas fa-search fa-fw"></i><span> 搜索</span></a></div><div class="menus_items"><div class="menus_item"><a class="site-page" href="/web/"><i class="fa-fw fas fa-home"></i><span> 首页</span></a></div><div class="menus_item"><a class="site-page" href="/web/archives/"><i class="fa-fw fa fa-graduation-cap"></i><span> 博文</span></a></div><div class="menus_item"><a class="site-page" href="/web/sponsorWall/"><i class="fa-fw fas fa-images"></i><span> 赞助墙</span></a></div><div class="menus_item"><a class="site-page" href="/web/comment/"><i class="fa-fw fa fa-paper-plane"></i><span> 留言板</span></a></div><div class="menus_item"><a class="site-page" href="/web/link/"><i class="fa-fw fas fa-link"></i><span> 友链</span></a></div><div class="menus_item"><a class="site-page" href="/web/about/"><i class="fa-fw fas fa-heart"></i><span> 关于</span></a></div><div class="menus_item"><a class="site-page" href="/web/other/"><i class="fa-fw fas fa-coffee"></i><span> Demo</span></a></div></div><div id="toggle-menu"><a class="site-page"><i class="fas fa-bars fa-fw"></i></a></div></div></nav><div id="post-info"><h1 class="post-title">个人简历大全 😘</h1><div id="post-meta"><div class="meta-firstline"><span class="post-meta-date"><i class="far fa-calendar-alt fa-fw post-meta-icon"></i><span class="post-meta-label">发表于</span><time class="post-meta-date-created" datetime="2022-11-26T16:31:04.810Z" title="发表于 2022-11-27 00:31:04">2022-11-27</time><span class="post-meta-separator">|</span><i class="fas fa-history fa-fw post-meta-icon"></i><span class="post-meta-label">更新于</span><time class="post-meta-date-updated" datetime="2022-06-22T16:27:23.000Z" title="更新于 2022-06-23 00:27:23">2022-06-23</time></span><span class="post-meta-categories"><span class="post-meta-separator">|</span><i class="fas fa-inbox fa-fw post-meta-icon"></i><a class="post-meta-categories" href="/web/categories/%E7%BB%8F%E9%AA%8C%E8%AE%B0%E5%BD%95/">经验记录</a></span></div><div class="meta-secondline"><span class="post-meta-separator">|</span><span class="post-meta-wordcount"><i class="far fa-file-word fa-fw post-meta-icon"></i><span class="post-meta-label">字数总计:</span><span class="word-count">13.2k</span><span class="post-meta-separator">|</span><i class="far fa-clock fa-fw post-meta-icon"></i><span class="post-meta-label">阅读时长:</span><span>42分钟</span></span><span class="post-meta-separator">|</span><span class="post-meta-pv-cv" id="" data-flag-title="个人简历大全 😘"><i class="far fa-eye fa-fw post-meta-icon"></i><span class="post-meta-label">阅读量:</span><span id="busuanzi_value_page_pv"></span></span></div></div></div></header><main class="layout" id="content-inner"><div id="post"><article class="post-content" id="article-container"><h1 id="马踏优选"><a href="#马踏优选" class="headerlink" title="马踏优选"></a>马踏优选</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2022/5-2022/7</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：茂名市舜有软件有限公司</td>
</tr>
<tr>
<td>项目描述：一个面向小商户提供在线平台的小程序，是一款在线购物平台，可以实现在线购物，生成订单等功能  <br/>1.每次请求数据调用uni.showLoading给用户一个加载信息。 <br/>2.搜索组件、商品列表、订单详情使用了uniapp分包，提高进入页面时的加载速度。 <br/>3.使用mixins全局混入，底部导航栏来分发 vue 组件中购物车数量、购物车徽标等可复用功能，购物车视图不需要重新刷新。 <br/>4.搜索模块：实现了搜索关键字，搜索历史，搜索结果列表，使用了自己封装的防抖方法。<br/>5.商品列表：请求数据时，默认关闭节流阀，动态渲染商品列表，获取商品列表数据的时候开启节流阀，请求完毕关闭节流阀，使用下拉刷新onPullDownRefresh重置关键数据并重新发起请求。使用onReachBottom，当滑动到达底部150距离的时候判断是否还有下一页，有则页数+1，无则调用uni.showLoading给用户提示信息。 <br/>6.订单详情： 使用uni.previewImage 方法预览图片，使用字符串的replace方法，为img标签添加行内的style样式解决图片底部空白间隙的问题，使用了rich-text商品详情信息图片渲染到页面。 <br/>7.购物车：通过将购物车数据存储在vuex，将购物车中的数据持久化存储在本地，使用mutations方法对购物车商品进行商品删除、全选、单选、数量等功能的实现。通过判断购物车的长度，当长度不等于0是正常显示，否则出现空白购物车。</td>
</tr>
</tbody>
</table>
</div>
<h1 id="启果果后台管理系统"><a href="#启果果后台管理系统" class="headerlink" title="启果果后台管理系统"></a>启果果后台管理系统</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2022/1-2022/4</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：茂名市舜有软件有限公司</td>
</tr>
<tr>
<td>项目描述：启果果后台管理系统集成了登陆、商品管理、分类管理、订单管理、系统管理等多个模块的相关业务的呈现，数据可视化功能，实现智能化运营。  <br/>1.对axios进行封装，在请求拦截处添加token，使用登陆成功后存储在localstorage的token进行权限判断，token验证成功跳转首页。 <br/>2.利用Element ui封装业务组件统了各个业务模块的 ui交互。 <br/>3.使vue-router实现路由跳转，懒加载等，通过路由守卫拦截处理，判断是是否登陆，登陆成功状态的话，就next()顺利跳转，否则就跳转到登录页面。 <br/>4.登陆：验证用户登陆成功后，通过localStore存储token并实现数据持久化，通过后台返回的数据来获取用户的详细信息，退出登陆清除localStore储存的用户数据。 <br/>5.首页：使用Echarts获取折线图数据并渲染出图表，实现图表可视化展示。 <br/>6.菜单：通过递归将扁平化数据转换为树状结构。使用Element-UI的Menu组件对列表进行封装，动态渲染，根据自己点击的子模块，做到不同页面跳转的实现及页面的渲染，。 7.商品管理、订单管理：使用Table组件和Pagination组件对数据进行分页处理，实现基本的CRUD操作。</td>
</tr>
</tbody>
</table>
</div>
<h1 id="小兔鲜儿"><a href="#小兔鲜儿" class="headerlink" title="小兔鲜儿"></a>小兔鲜儿</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2021/2-2021/6</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：茂名市舜有软件有限公司</td>
</tr>
<tr>
<td>项目描述：该项目是基于vue-cli创建的一个综合性的电商购物网站，类似于淘宝，京东商城。登录后用户可以在该网站浏览商品，加入购物车，下订单以及各种各样的活动。未登录的用户可以不能进行下单，他们可以通过手机号注册或者qq登录的方式进行登录完成购物。  <br/>1.封装大量组件，轮播图，复选框，对话框消息提示和消息确认组件等。 <br/>2.实现路由跳转、路由懒加载、组件切换等操作。 <br/>3.通过安装vuex插件来支持vuex的状态持久化，让在vuex中存储的状态和数据存储在本地。在开发过程中，用户的信息（名字，头像，token等）需要在vuex中存储且需要存储在本地购物车未登录状态下也支持，管理在vuex中的数据需要存储在本地。 <br/>4.登陆模块：通过判断当前点击状态来实现账号登陆和扫码登陆动态切换。使用通过表单验证实现非空验证，验证成功/失败调用Message进行消息提示，并且规定购物车必须要先登录才能使用。 <br/>5.商品分类：根据用户点击的类别实现动态渲染数据，使用Provide和Inject对组件进行传值。 <br/>6.商品详情：详情图片实现放大镜、tab切换效果，规格选择、商品评价等效果。 <br/>7.购物车：购物车页面要能够显示商品的详细信息，点击加入购物车将把当前点击商品的所有内容数据存储在localStorage，从本地拿数据并渲染购物车页面，点击复选框选中并同步底部的复选框，点击底部的全选框同步上面的复选框，并计算商品总价。  <br/>链接：<a target="_blank" rel="noopener" href="http://erabbit.itheima.net/">http://erabbit.itheima.net/</a></td>
</tr>
</tbody>
</table>
</div>
<h1 id="市场摊位管理后台系统"><a href="#市场摊位管理后台系统" class="headerlink" title="市场摊位管理后台系统"></a>市场摊位管理后台系统</h1><div class="table-container">
<table>
<thead>
<tr>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>项目描述：该项目是一个对摊位管理,便于用户和商家租赁的管理系统。采用 vue2,vuex,axios,element ui 框架等搭建完成。主要有系统模块,市场模块,卫生模块,摊主模块等 <br/>项目技术: <br/>1、对登陆页面做预验证,发送 axios 请求,并将返回的 token 存在本地 sessionstorage,在二次封装 的 axios 请求拦截中的 Authorization 上配置 token,每次请求就都会带上 token。<br/>2、项目采用 axios 进行前后端的交互,并对 axios 进行二次封装,根据环境变量统一请求路径,减少页面的重复操作。 <br/>3、在从登录跳到主界面时,在 vue 全局前置守卫 beforeEach 中 进行 token验证,有 token就允许 跳到主页,没有就会返回登录页,在地址栏上面输入地址也会对 token进行验证。 <br/>4、应用了 ElementUI 组件进行功能效果实现。</td>
</tr>
</tbody>
</table>
</div>
<h1 id="个人优势："><a href="#个人优势：" class="headerlink" title="个人优势："></a>个人优势：</h1><div class="table-container">
<table>
<thead>
<tr>
<th>1.熟练使用HTML，CSS，JavaScript，es6等前端技术 <br/>2.熟练使用HTML5，CSS3可实现网页动画效果，以及Less和Sass预处理器 <br/>3.熟悉Vue框架，能熟练使用Vuex，Vue-router等Vue生态，完成前端项目的开发 <br/>4.了解React框架，React Hooks，ReactRouter，Redux的使用 <br/>5.掌握使用第三方UI库，Bootstrap，LayUI，Element-UI <br/>6.掌握VSCode，HbuliderX，Photoshop，Adobe Illustrator等工具使用 <br/>7.熟练各平台小程序的开发 <br/>8.掌握Git，SVN代理工具的使用 <br/>9.熟悉Webpack，Vite，Pinia的使用<br/>10.熟练掌握并会运用前端的基本框架和类库：jQuery、ECharts、ElementUI、Vxe-table、Antv X6、AntvG6、vxe-virtual-tree、js-xlsx、xlsx-style、sortTable、pdf.js 等；<br/>11.熟练运⽤微信小程序开发技术（wxml + wxss + js）、WUX Weapp、colorUI 框架；</th>
</tr>
</thead>
<tbody>
<tr>
<td>掌握HTML、CSS，能够根据设计稿还原出对应的页面。 <br/>掌握原生JavaScript，掌握原型，Event Loop，异步等概念，熟练使用ES6新特性。 <br/>熟悉Vue及相关技术栈，了解生命周期、组件化等概念，能够使用Vue开发单页应用。 <br/>熟悉React及相关第三方库的使用，能够根据需求开发前端应用。 <br/>了解前端工程化，掌握webpack工程化打包工具的配置，能够配置打包分包优化处理。 <br/>了解uniapp开发框架，能够使用uniapp进行小程序开发。 <br/>Npm &amp; Git ，能够使用Node.js搭配Express进行基本后端开发。 <br/>了解前端和后端对接的流程及本地开发和生产环境下的接口处理。 <br/>了解Docker的使用及Linux系统的基本操作。</td>
</tr>
<tr>
<td>1.熟悉掌握JavaScript语言，ES6新特性，进行开发；<br/>2.精通使用HTML、CSS，使用HTML+CSS盒子布局,使用CSS媒体查询响应式布局；<br/>3.熟悉React框架全家桶,使用react 16.7版本开发web前端项目； <br/>4.精通Vue.js主流框架，熟练运用Vue-Router，Vuex，生命周期等的用法； <br/>5.熟悉使用AJAX（axios）进行数据交互，关键字搜索； <br/>6.掌握localStoorage永久存储、sessionStorage临时存储等前端存储方法； <br/>7.熟悉运用JavaScript的map，forEact，filter等遍历方法； <br/>8.掌握ui框架Vant，ECharts, Element, AntDesignMobile，Mint，Ant Design等组件库的运用； <br/>9.熟悉把项目运用webpack打包； <br/>10.了解i18n国际化插件实现切换语言，以及git的基本操作； <br/>11.熟悉使用全局状态或from表单获取页面内容和自动校验<br/>\1. 在组件挂载时请求数据，往state里存储数据，使用map来渲染列表；<br/>\2. 运用this.state实现各个组件之间的传参，通信，共享和onChang校验；<br/>\3. 使用 ocr 识别封装了身份证、其他证件识别组件和文件上传组件，提高了开发效率与代码的可阅读性。<br/>\4. 完成登录注册的编写与使用 bizcharts 完成了中心首页图表的渲染展示，使得数据更清晰化。<br/>\5. 人伤模块：使用 antd-mobile 完成对个人、居住、医院信息等编辑与详细页面模块与签名功能的编写。<br/>\6. 通过使用使用 tim 即时通讯，实现了审核人与车童之间视频查勘定损作业功能，提高车童的作业效率。<br/>\7. 注册全局过滤器，处理文本数据和时间的格式化，注册全局的处理图片加载失败的自定义指令。<br/>\8. 基于 RBAC 权限设计思想，控制登录用户的菜单权限和按钮权限。<br/>\9. 使用路由懒加载优化打包问题以及后期维护与更新。<br/>\9.使用了onReachBottom实现上拉加载，onPullDownfresh实现下拉刷新，优化用户体验。<br/>\10. 实现支付流程，创建订单，预支付，uni.requestPayment发起微信支付等功能。<br/>\11. 引入环信sdk，患者购买咨询服务后可与医生实时对话。<br/>\12. 使用sortablejs对树形table表格实现拖拽排序效果。<br/>\13. 笛卡尔乘积算法对sku的实现。<br/>\14. 引入Eslint配合Prettier对项目进行代码规范，提高代码可读性。<br/>\15. 负责人脸识别功能的实现，调用系统摄像头获取视频流，使用face-api.js对视频流 进行人脸特征识别。<br/>\16. 使用eval函数实现计算机功能。<br/>\17. 运用keep-alive技术对大方快讯模块进行缓存优化，避免页面的重复构建，减少服务器请求，加快页面响应速度，增强用户体验。<br/>\18. 调用微信支付接口，获取用户的 AppID,实现支付的金额参数与用户展示余额相绑定等功能。<br/>\19. 小程序端采用react+taro搭建完成。<br/>\20. 教师端基于vue.js+nw.js 封装成exe可执行程序。调用Windows系统程序功能，完成屏幕录制，截屏画图，屏幕广播等主要功能。<br/>\21. 使用 vue-print-nb 完成车辆保单详情打印功能。<br/>\22. 使用 vue-cropper 对头像进行裁剪上传。<br/>\23. 门户端使用vue-simple-verify来进行一个滑动+短信验证码验证。<br/>\24. 使用iSignature电子签章进行一些盖章操作。<br/>\25. 表格使用vxe-table组件来进行一个复杂可编辑表格需求的一个使用。<br/>\26. 个人中心模块，使用 OCR 文字识别技术实现反馈功能,让用户可以通过上传文字截图识别出所需文字，让用户体验更好。<br/>\27. 个人中心模块，使用 OCR 识别技术实现车商认证功能，让用户可以通过拍照识别或者在本地相册中上传图片进行识别，实现车商用户的认证。<br/>\28. 当页面图片过多的时候，就会加载很慢，服务器压力也比较大，为了提高用户体验，可以使用延迟加载的技术lazyload；为了不影响 JS 性能，尽量减少 Dom 操作次数，还可以采用 cdn 托管来优化开发。<br/>\29. 项目技术栈：Vue + axios + element-ui + element-tree-grid 。<br/>\30. 常用游戏引擎，egret ， coco2d.js ， threejs ,egaret 龙骨动画设计及渲染，动态对象换装、对象碰撞检测等处理。<br/>\31. 使用自定义hook复用逻辑，模态框，选择器，导航栏，进度条，搜索框<br/>\32. 日常维护优化项目(异步引入、按需引入并使用webpack设置mode为production开启TreeShaking，对代码进行分包并压缩，配置小图片压成base64)<br/>\33. 列表数据过多造成页面卡顿。由于antd的table组件不便于重新封装虚拟滚动功能，改为 使用vxe-table组件。<br/>\34. 实时的轨迹采集，用wx.onLocationChange获取实时位置信息更新。onLocationChange事件触发频 率过高，会导致获取相同的经纬度点，所以采用了节流的方式，在一定的时间间隔内只更新一次数据，减少setData频 率和页面渲染压力。<br/>\35.  基于腾讯实时音视频 SDK 开发，实现多人通话与直播，提供便捷的导购功能。<br/>\36.  使用 wxml-to-canvas，实现一键生成海报分享微信或保存等功能。<br/>\37.  使用 wx-charts，完成各种图表的展示，实现图表数据可视化统计。<br/>\38.  主应用跟微应用通过 IceStark 提供的库@ice/stark-data 进行通讯。<br/>\39.  使用 Formaking 进行表单设计。<br/>\40.  React + redux + react-thunk + react-router 搭建的移动端动漫网站。<br/>\41.  Vue3 + Vite + pinia 与 node 搭建的官网资源整合。<br/>\42. 使用了uni.getProvider做微信授权功能,授权后使用uni.requestPayment做微信支付功能。<br/>\43. 使用 VeeValidate 完成表单校验用户登录。<br/>\44. 项目中使用 esLint 插件来进行语法规则与代码风格检查。<br/>\45. 用户管理界面使用了 pl-table 表格插件替代 el-table，优化表格数据太多导致页面卡顿的情况。<br/>\46. 搭建符合规范的项目脚手架，包括 editorconfig、eslint、pritter、commintlint、husky 等规范的搭建。<br/>\47. H5端使用html2canvans、domtoimage生成年度报告并分享，并解决ios端图片部分黑屏问题，兼容ios端及Android端。使用响应式布局兼容不同机型。<br/>\48. 使用webview代替iframe嵌入第三方系统，是系统能跟第三方系统正常通信，解决第三方网站设置frame-ancestor ‘self’ 安全策略无法访问的问题<br/>\49. 二次封装axios请求，根据环境变量统一请求路径，解决打包后win.loadURL将http:转换为app:的问题<br/>\50. 使用win.webContents监听程序崩溃并自动重启程序，保证程序能一直正常工作<br/>\51. APP内置sqllite数据库，实现任务上传数据保存到数据库中，等网络在线时再从数据库取出上传。<br/>\52. 使用Pdf.js插件，结合webView标签，封装了pdf在线预览组件。<br/>\53. nvue使用直播流live-pusher实现人脸比对功能。<br/>\54. 使用html2canvas将当前页面生成图片并保存，使用自定义插件连接蓝牙打印机进行打印。<br/>\55. 使用插件vue2-org-tree、amfe-flexible和postcss-pxtorem实现页面树形架构功能和屏幕自适应。<br/>\56. 使用jsplumb对数据库模型进行可视化操作（类似于PowerDesigner，可以进行拖曳建表，点击表格添加字段、可以进行不同表之间字段到字段的连线等功能）。<br/>\57. Vue 全家桶 +vant+Axios+sass+lbs(使用了 map 和百度地图的 server api 来实现)。<br/>\58. React采用 Ant-Design-Pro框架进行后台管理系统页面的组件化开发，按需加载相关UI组件。<br/>\59. 课程详情页：直观展示课程的详情信息，使用@scrolltolower实现触底加载，使用@refresherrefresh实现下拉刷新，提升用户体。<br/>\59. 问题:前端设备失去网络，无法触发回调事件，服务器异常断开，前端无法收到信息，二者导致和后端交互终止<br/>\59. 优化：定时器做心跳检测，调用send发送空包，规定时间内未收到服务器字段则close处理。<br/>1、问题：利用谷歌浏览器自带的lighthouse检测否是某个文件（js、图片，css）过大还是接口请求时间过长，还是某段代码执行过长。<br/>性能优化:<br/>● 对于长列表使用虚拟列表,优化首屏加载速度慢问题，减少无用dom渲染;<br/>● 使用防抖节流减少代码的执行次数;<br/>● 小图片通过webpack转base64内联到html，减少请求;<br/>2、问题：用户上传高质量图片速度较慢，体验较差<br/>优化：思路获取file文件及类型，转base64，通过canvas压缩base64接着转换成二进制，最后输出formData上传。封装该函数到组件并添加可选项。<br/>4、问题：项目模块较大，首先图片较多，首次渲染不流畅。<br/>解决：通过import动态加载，webpack配置多入口，gzip压缩优化大量图片数据，首次渲染可视区图片采用低画质展示，详情页展示高清画质。非可视区采用图片懒加载，增加首屏渲染速度和用户体验。</td>
</tr>
<tr>
<td>1、熟练掌握 HTML+CSS 能够还原UI工作稿内容；<br/>2、熟练掌握 JavaScript，熟悉 TypeScript 语法规范，掌握ES6以上的语法；<br/>3、熟练掌握 Element-ui、Bootstrap、vant 等ui框架使用；<br/>4、熟练掌握使用Vue全家桶（Vue-cli、VueRouter、Vuex、Axios）等轻量级前端框架的使用；<br/>5、了解 微信小程序 和 React 开发框架，能根据开发文档编写项目；<br/>6、了解 node.js，利用其搭建简单的服务器；<br/>7、熟练使用 web 实时通信 SignalR，熟练使用即时通讯服务 webscoket；</td>
</tr>
<tr>
<td>2年工作经验 10000-15000元/月<br/>1. 熟悉React全家桶，及Redux全家桶的使用，如react-redux，redux-saga等<br/>2. 熟悉Typescript的使用。<br/>3. 项目中有使用过Angular + Rxjs 来进行开发。<br/>4. 熟悉Vue2、及周边插件库Vuex Vue-router的使用，能够使用Vue，React脚手架快速搭建项目，进行项目的开发且对相应的生命周期函数/钩子函数有一定的理解。<br/>5. 了解Vue3新特性的使用。<br/>6. 熟练使用ES6/7/8的规范来对项目进行开发，如常用的模板字符串，扩展运算符，Promise,对象的解构赋值,箭头函数，async/await等等。<br/>7. 开发过程中熟练使用ajax,axios,Fetch来请求后端返回的数据，通过遍历进一步来实现页面渲染，熟练使用Postman来测试后端接口。<br/>8. 项目中使用过Cookie，LocalStorage，SessionStorage等本地存储技术来进行开发，熟悉其优缺点。<br/>9. 熟悉跨域解决方案，能根据项目中不同场景下出现的跨域能使用不同的方法解决。<br/>10. 熟悉Webpack 常用配置，了解Vite。<br/>11. 熟悉Git命令来管理代码，了解GitHub 自动化action配置<br/>12. 开发过程中使用过npm，cnpm，yarn等包管理工具。<br/>13. 熟练使用常用的UI框架，如vant、ElementUI、Ant-Design、Bootstrap等等。<br/>14. 熟悉HTML5新特性，CSS3常用技术，对语义化有一定理解。</td>
</tr>
<tr>
<td>1、配合产品团队完成项目的需求分析，业务设计和方案实现； <br/>2、与产品、后台开发人员保持良好沟通，理解、消化各方需求，并落实为具体的开发工作； <br/>3、负责公司前端产品的研发，并与设计师、后端开发人员有效沟通实现产品的界面和相关功能。<br/>4、根据公司项目组的产品设计与开发任务要求，对软件的功能进行了解，并进行代码编写实现。<br/>4、定期的更新和优化产品，进行代码的维护。<br/>4、解决项目在开发过程中遇到的技术和业务等问题。<br/>4、参与项目需求分析，设计，编码等开发工作。<br/>4、保证好页面的正常运营，及时修复出现的Bug。<br/>4、根据产品 (网站、小程序)需求， 对产品的整体界面结构、操作流程等做出编写代码。<br/>使用graphql对接公司项目需求。<br/>能够熟练使用graphql 做条件过滤、树嵌套递归查询数据，实现业务逻辑。<br/>经验累积对模块化开发更有一定的见解：<br/>多思考行业搭积木思想，对microApp 多框架基座模块集成有一定理解。能把模块思想应用到实际工作做到高效可复用的模块开发。<br/>使用cesium、threejs处理 revit 3d模型展示以及交互，对接设备物联网实时监控系统 。<br/></td>
</tr>
<tr>
<td>8000-9000元/月 2年工作经验<br/>精通 HTML 和 CSS，能够独立的搭建静态页面，熟悉 HTML5 和 CSS3 的一些新特性。<br/>熟练使用原生 JavaScript，会使用面向对象的编程方式开发，且掌握 ES6 常用的新特性。<br/>熟练使用 jQuery 函数库。<br/>熟练使用 AJAX 和 axios 插件进行网络请求渲染页面，了解跨域问题。<br/>熟练使用 Vue 的全家桶（vue-cli、vue-router、Vuex，pinia）进行开发。<br/>熟练使用 React（create-react-app、react-router-dom、redux）进行开发。<br/>熟练使用 Less 或者 Sass 进行样式预编译，高效低重复完成样式编写。<br/>熟练使用 Element、Vant、Ant-design 等 ui 框架进行快速开发。<br/>熟练使用 vue-lazyload，vue-i18n，Echarts，better-scroll 等插件。<br/>掌握使用原生小程序和 uni-app 进行小程序的开发。<br/>掌握 TypeScript 的类型、断言、接口、泛型等一些基本特性。<br/>掌握 Git 版本管理工具，npm 命令，webpack 和 Vite 构建工具等。<br/>掌握 Photoshop，AI，PR 等设计软件的基本操作。<br/>了解 Python，Mysql，Linux，node.js 等基础知识。</td>
</tr>
<tr>
<td>8000-9000元/月 1年 5个月<br/>熟练Vue、Vue3及周边工具库Vuex、Vue Router、Element；<br/>熟练React及周边工具库Redux、React Router、PubSub、antd等<br/>熟练HTML/HTML5、CSS/CSS3、Javascript等web前端技术；<br/>熟练webpack、git、axios、less、sass等前端常用工具<br/>熟练uni-app开发微信小程序；<br/>熟练AngularJs框架；<br/>了解node.js开发、TypeStript；</td>
</tr>
<tr>
<td>基础技能 <br/>Web基础：了解原生HTML、CSS，能够使用HTML、CSS实现复杂页面布局，使用Javascript编写动态页面或是组件，使用Tailwind等CSS库提高开发效率及页面美观程度，使用Ant Design及Element等UI库实现复杂功能。 <br/>Node.js：能够用Node.js的npm进行项目的依赖包管理。  <br/>前端框架 <br/>React：了解React关于JSX、Fiber、Virtual DOM和Diffing算法等原理。熟练掌握State、生命周期、Refs、Hook等特性，以及组件式编程理念。 <br/>React扩展：能够使用React Router管理页面路由，使用React Redux管理全局数据，以构造订阅发布模型的页面应用。 Vue：了解Vue 2的特性及常用API，以及Vue 3的组合式API等新特性。 <br/>Nest：知道如何用控制器编写路由，用Mongoose提供的API操作MongoDB数据库，用Swagger列出API列表提高工作效率，能够独立编写一个后端服务器，并将前两者部署到Docker容器上，为Web页面提供简单后端服务。  <br/>进阶技能 <br/>TypeScript：熟练掌握类型、接口、元组、泛型等相关知识，能够使用类型系统极大提高个人和团队开发工作效率，能够将React框架的JavaScript项目转换为TypeScript项目。 <br/>Three.js：能够使用Three.js在网站上渲染可以进行简单互动的3D模型，极大增加页面美观程度。</td>
</tr>
<tr>
<td>3 年 12k-3k<br/>1. 熟练使用 HTML、CSS 、JavaScript 、ES6、Sass 相关技能，独立完成页面布局<br/>2. 熟练使用 vue、vue-router、vuex、axios、等 vue 全家桶；<br/>3. 熟悉 React 框架、使用 React+React-router+Redux+Antd+axios+Sass 进行项目开发<br/>4. 熟练使用 JQuery 库，高效开发、实现完美效果；<br/>5. 熟练使用 vw、vh、rem、Flex 布局，实现页面的自适应效果；<br/>6. 熟练使用 Ajax，Axios 技术，对后端请求数据，对前后端数据交互有清晰的认识；<br/>7. 熟悉 Bootstrap、ElementUI、VantUl、Antd、Swiper、等前端框架；<br/>8. 熟悉 Trao，ECharts 进行可视化图标的操作，使用 Umi 框架开发React 项目；<br/>9. 掌握 Git 等版本控制工具进行代码管理，Webpack 打包工具对代码进行打包；<br/>10. 掌握 uni/app、微信小程序、进行小程序的开发；</td>
</tr>
<tr>
<td>4年 15k-20k<br/>1、熟悉 HTML5 /JavaScript/typescript/jQuery/Ajax/uniapp/微信小程序 等 Web 开发技术;<br/>2、熟练 flex 布局，rem 布局 和 Bootstrap 框架来适配移动端和 PC 端页面;<br/>3、熟练使用 Vue 、Vue-Router、Vuex 等框架和插件，熟悉 Vue 的组件模块化;<br/>4、熟悉react-router路由跳转 和 redux，了解React / Angular/electron 框架的基础操作<br/>5、熟悉前端各种UI组件库，如ElementUI、Mint、Vant、Muse、iView等;<br/>6、熟悉掌握 ES6，熟悉掌握 webpack、git、svn 等技术，使用 gitlab 管理代码；<br/>7、熟悉前后端分离开发,了解nodejs 和 koa2框架， 熟悉掌握 less，sass、stylus 等前端编译语言;<br/>8、熟练浏览器的适配问题和前端优化方案；有移动端、H5、pc端网页、微信小程序等开发经验，</td>
</tr>
</tbody>
</table>
</div>
<h1 id="伊家民宿后台管理系统"><a href="#伊家民宿后台管理系统" class="headerlink" title="伊家民宿后台管理系统"></a>伊家民宿后台管理系统</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2022/1-2022/5</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：无<strong>9000-12000元/月</strong></td>
</tr>
<tr>
<td>项目描述：项目简介:这是一个管理民宿房态的后台管理系统,自动同步房态、房价日历、订单、房客信息、一站 处理,让运营工作游刃有余。有预约房源、房源管理、评价房源、、数据统计、订单管理、费用支出、 意见反馈等模块。 技术要点: 1、使用Vite构建工具+Vue3+ts+ElementUl开发后台管理页面 <br/>2、封装Axios网络请求,使用interceptors.request和interceptors.response对请求和响应进拦截 <br/>3、实现了权限管理,因为每个用户要看到的页面和数据都是不一样的,所以使用Vuex存用户的权限 列表,router.beforeEach进行路由拦截,动态添加路由路径,并根据token值判断用户使用存在跳转到 相应页面 <br/>4、使用插槽结合vue指令对后端返回的数据进行判断当前是在住状态还是空房状态。编辑时调用后 台接口把得到的数据赋值给v-model实现数据回显 <br/>5、使用pagination分页按钮的size-change和current-change改变当前页和每页条数实现对多 条数据管理。 <br/>6、利用组件的rules属性写入表单的验证规则,并给提交按钮添加validate方法验证表单规则,当不 符合条件的时有对应文字提示 <br/>7、通过Echarts组件实现数据可视化,显示地图和地图摇杆以及饼状图 <br/>8、使用组件化开发,封装了分页组件功能,对其实现高复用性以及统一管理 <br/>9、利用TypeScript增加了代码的可读性与可维护性 项目经历 <br/>主要职责：<br/>项目职责: <br/>1、根据设计稿实现后台管理系统布局 <br/>2、负责查询房源模块、输入手机号、身份证号或者房源名称进行精准搜索 <br/>3、负责权限管理,管理员和普通员工有不同的权限列表<br/>4、负责数据统计分析,利用可视化图展示全面的、多维度的数据报表以及详细记录 <br/>5、负责发布房源,上传房源图片和文字描述增加房源信息 <br/>6、预约房源模块,选择入住时间和离开时间,填入身份证号可预约房源</td>
</tr>
</tbody>
</table>
</div>
<h1 id="冒个泡旅行"><a href="#冒个泡旅行" class="headerlink" title="冒个泡旅行"></a>冒个泡旅行</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2021/5-2021/8</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：无<strong>9000-12000元/月</strong></td>
</tr>
<tr>
<td>项目描述：项目介绍:”冒个泡旅行”是一款为所有移动端亭湖提供的高品质的旅游产品和服务的移动端网站, 让用户足不出户就可以了解到受欢迎的景点以及周边美食,该网站可以为用户提供在线预约旅游景点 门票,酒店门票以及在线购买特色产品 <br/>技术要点: <br/>1、使用vantui+蓝湖+ps对页面进行布局 <br/>2、使用全局路由守卫实现对路由的拦截,判断localStorage里的token值是否存在,若存在则允许跳 转到订单页面 <br/>3、使用了Vuex存储了搜索数据,使得多个组件传值方便 <br/>4、因为底部tabbar跳转重复点击会出现报错,解决了当前页面重复点击报错功能 <br/>5、使用了less预处理器和/deep/深度修改样式解决了vantui初始样式问题 <br/>6、封装了Axios请求,在请求拦截里面携带了请求头 <br/>7、在首页产品列表里运用了节流对产品进行预加载,减轻浏览器的负担 项目经历 <br/>主要职责：<br/>项目职责: <br/>1、跟后台进行数据对接,结合UI框架将数据渲染到页面上 <br/>2、搜索模块,可通过搜索目的地/景点/酒店/地区搜索到相关的旅游景点,推荐目的地限时秒杀,销量 最高、今日上新、限时抢购等 <br/>3、首页轮播图以及底部此菜单栏的实现 <br/>4、产品详情页信息展示,包括特色,产品地址,相关推荐,费用包含,预定须知等等 <br/>5、根据用户点击所跳转对应的页面</td>
</tr>
</tbody>
</table>
</div>
<h1 id="急时鲜配管理系统"><a href="#急时鲜配管理系统" class="headerlink" title="急时鲜配管理系统"></a>急时鲜配管理系统</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2021/11-2022/5 <strong>12000-15000元/月</strong>  2年</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：深圳神裂创科商贸有限公司</td>
</tr>
<tr>
<td>项目描述：<br/>是一套简单方便用户查询，配送员智能配送，企业鲜奶站点自动统计报量管理，送货到家数字化营销的智能管理系统。主要包括：今日概况、配送报表、配送订单、数据统计、财务统计、客户管理、基础设置、日志管理模块  负责模块：负责今日概况模块、配送报表模块、数据统计、客户管理等模块功能 <br/>项目技术栈：<br/>1.基于 Vue 框架开发，Vue-cli 脚手架搭建项目，通过 element-ui 组件库完成页面布局 <br/>2.使用less书写样式，对element-ui的一些默认样式进行 二次修改 <br/>3.Vuex中的store分模块管理,同时开启模块的namespaced并合理使用mutations和actions <br/>4.使用vue的mixin来分发 Vue 组件中的可复用功能 <br/>5.使用Vue-router实现路由跳转，在导航守卫里面引入了Nprogress 并完成了权限控制的主要逻辑。 <br/>6. 使用axios，并且对axios 二次封装，不同模块请求放入单独文件 通过axios拦截器完成token携带和错误的统一处理 <br/>7.使用VueI18n插件完成国际化功能 <br/>8. 使用EChart插件实现数据的可视化，并根据项目需求完成 定制化 <br/>9. token过期处理采用了 主动介入和被动处理 两种方式相结合 <br/>10. 表单编辑回显功能，用到了深拷贝（deep copy）</td>
</tr>
</tbody>
</table>
</div>
<h1 id="乐家园物业管理系统"><a href="#乐家园物业管理系统" class="headerlink" title="乐家园物业管理系统"></a>乐家园物业管理系统</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2021/4-2021/11</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：深圳神裂创科商贸有限公司</td>
</tr>
<tr>
<td>项目描述：<br/>商户管理（商户认证、管理）、公告管理（小区公告管理）、智能服务管理（快递柜管理）、账单收费管理（电费网充）等多功能的物流管理系统 负责模块：主要负责用户登录，首页，业务管理、商户管理、公告管理等模块功能 <br/>项目技术栈： <br/>1.使用 vue-cli 脚手架搭建项目结构，配合 element-ui 组件库进行开发 <br/>2.使用 axios 进行前后端数据交互，并且对axios 二次封装 ，不同模块请求放入单独文件，进行相对应的请求、响应处理 3.通过 axios 拦截器让需携带token的接口统一携带token，css预处理器使用less，提高编码效率 <br/>4.使用 vue-router 实现路由跳转，并借助 vue-router 导航守卫 进行全局登录状态的判断 <br/>5.使用 vuex 对用户信息进行管理 <br/>6.通过vue-i18n插件实现国际化语言切换 <br/>7.项目中图片存储到了三方图片存储服务器腾讯云cos <br/>8.项目中对多个复用组件进行抽取封装，提高代码的可复用性以及可维护性 <br/>9.利用路由懒加载提高了页面的加载速度</td>
</tr>
</tbody>
</table>
</div>
<h1 id="拔草购-App"><a href="#拔草购-App" class="headerlink" title="拔草购-App"></a>拔草购-App</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2020/3-2020/9</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：深圳神裂创科商贸有限公司</td>
</tr>
<tr>
<td>项目描述：<br/>该项目是一个小型的电商网站，提供了基本的商品展示和购买功能。包含了通讯、商品详情页面、分类、图片列表、图片详情、购物车等模块的开发。 负责模块：订单管理、数据统计等模块。 <br/>项目技术栈： <br/>根据 HTML5和CSS进行页面的构建； <br/>1、负责首页、登录、购物车等页面模块静态页面的编写，功能的实现，与后台的数据交互； <br/>2、使用 Vue-cli搭建开发环境，Vue-Router 按需导出，将axios封装单独文件，提高用户体验与维护； <br/>3、使用 axios技术设置请求与响应拦截，防止恶意注入； <br/>4、使用 vuex与localstorage 实现数据共享与判断用户是否登录； <br/>5、使用 postcss-pxtorem插件与amfe-flexible 解决移动端的适配问题；<br/>6、使用 moment 解决时间格式问题与big-int解决axios导致精度丢失问题；</td>
</tr>
</tbody>
</table>
</div>
<h1 id="母婴购"><a href="#母婴购" class="headerlink" title="母婴购"></a>母婴购</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2020/8-2020/11</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：广州盛勤网络科技有限公司</td>
</tr>
<tr>
<td>项目描述：母婴购是一个优质母婴用品推荐，汇聚千万妈妈的育儿分享网站。可以让妈妈们在线查看各种母婴用品，和最新的母婴资讯，定期组织母婴用品团购活动，分享母婴品牌特卖活动，交流育儿经验心得，真正让妈妈们省时省力省钱省心的母婴网站。主要模块包括亲子活动、幸福准妈、产后恢复、在线客服、信息发布等；  <br/>主技术栈： React + Redux + Router + Ant-Design + Sass； <br/>责任描述： <br/>1、根据美术设计稿完成静态页开发； <br/>2、完成首页、亲自活动页、幸福准妈页的组件化开发与数据交互； <br/>3、封装形成可复用的ProductCard、ExpandableList、GuestBook等组件； <br/>4、根据产品与测试的反馈，修复BUG，优化性能； <br/>5、参与项目的版本发布与日常维护；</td>
</tr>
</tbody>
</table>
</div>
<h1 id="营销公社"><a href="#营销公社" class="headerlink" title="营销公社"></a>营销公社</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2021/8-2022/1</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：广州盛勤网络科技有限公司</td>
</tr>
<tr>
<td>项目描述：营销公社是一站式内容整合营销机构，宗旨于帮助企业用户实时连接客户、多途径推进商机、最大程度的实现企业的营销目标、创新营销模式。同时具有粉丝聚合、全媒体投放等优秀企业功用。主要模块包括首页，服务，红人矩阵，IP打造，案例，关于我们等；  <br/>主技术栈： React + Redux + Router + Sass + Ant-Design； 责任描述： <br/>1、根据美术设计稿完成静态页开发； <br/>2、完成首页、红人矩阵页、IP打造页的组件化开发与数据交互； <br/>3、封装形成可复用的BackTop、Slidehow等组件； <br/>4、根据产品与测试的反馈，修复BUG，优化性能； <br/>5、参与项目的版本发布与日常维护；</td>
</tr>
</tbody>
</table>
</div>
<h1 id="Italk"><a href="#Italk" class="headerlink" title="Italk"></a>Italk</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2020/8-2021/4</th>
</tr>
</thead>
<tbody>
<tr>
<td>项目描述：Italk支持在线聊天、视频通话、点对点断点续传文件、共享文件、网络硬盘、自定义面板、邮箱等多种功能，并可与多种通讯终端相连。 <br/>前端技术栈: Uni-app + Uni-ui + socket.io <br/>工作内容： <br/>1.使用Uni-ui进行页面的布局和排版 <br/>2.对登录的账号&amp;密码进行加密，格式效验等一系列登录功能 <br/>3. 进行用户与用户之间的通信，聊天等 <br/>4. 通过axios请求接口，实现数据渲染</td>
</tr>
</tbody>
</table>
</div>
<h1 id="炼小队CRM"><a href="#炼小队CRM" class="headerlink" title="炼小队CRM"></a>炼小队CRM</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2021/5-2022/5</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：无</td>
</tr>
<tr>
<td>项目描述：炼小队科技内部使用的客户管理系统,管理抖音,小红书,MCN等平台垂直领域带货达人<br/>项目架构:vue全家桶+echarts图表+ElementUI<br/>技术要点 : <br/>1.安装 Vue-Quill-Editor 插件,添加商品详情页编辑;<br/>2.结合 quill-image-extend-module 图片上传加强模块,在富文本中添加图片;<br/>3.使用 v-charts 插件,结合 echarts 官方文档,将销售数据可视化;<br/>4.数据模块观察公司全业务链数据,用看板的形式展示,同时配合使用element和echarts进行每天每周每年<br/>的销量趋势并且可以根据所选日期进行详细数据的表格下载<br/>5.封装 request 请求,搭配 promise 实现对请求与相应的拦截,并调用后端 RESful 风格的接口,对页面进行数据渲染;<br/>6.通过router.beforeEach重新发起请求,实现登录状态下刷新页面vuex中权限数据消失问题;<br/>7.用户的按钮权限,存储到vuex中定义公共函数,使用自定义指令,实现按钮权限控制;<br/>8.通过router.afterEach全局后置钩子配合nprogress,二次封装实现全局loading;<br/>9.通过keep-alive实现缓存页面保留页码,提高用户体验;</td>
</tr>
</tbody>
</table>
</div>
<div class="table-container">
<table>
<thead>
<tr>
<th><strong>10000-12000元/月</strong> 3年工作经验</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：无</td>
</tr>
<tr>
<td>项目描述：炼小队科技健身补剂综合商城<br/>项目架构:原生小程序+vant<br/>技术要点 : 1.使用wx.getSystemInfo APi动态计算页面滑动高度完成动态分类;<br/>2.wx.parse插件进行富文本渲染;<br/>3.wx.requestPayment进行订单合并付款;<br/>4.调用 canvas,实现小程序分享生成海报;<br/>5.通过button加上open-type=”share”属性,设置onShareAppMessage函数实现分享功能;<br/>6.使用button加上open-type=”contact”属性将当前产品卡片发给客服方便客户与客服交互;<br/>7.使用official-account在小程序中内嵌公众号卡片进行相互引流扩展客户;<br/>8.设置 enablePullDownRefresh,调用 onPullDownRefresh,实现下拉刷新;<br/>9.通过 wx.getStorage 获取本地 token 判断用户是否登录,未登录对一些功能不展示开放;</td>
</tr>
</tbody>
</table>
</div>
<h1 id="中材官网"><a href="#中材官网" class="headerlink" title="中材官网"></a>中材官网</h1><div class="table-container">
<table>
<thead>
<tr>
<th>项目地址 <a target="_blank" rel="noopener" href="http://zc.huangjuzi.top/">http://zc.huangjuzi.top/</a></th>
</tr>
</thead>
<tbody>
<tr>
<td>项目描述：本项目是一个中材网站，使用 nuxt 框架，构建的单页面应用，使用element-ui 组件库中部分功能、swiper 等一些第三方插件进行快速开发，其中涉及到网站的国际化、即时通讯等，国际化使用了 i18n 插件进行开发，即时通讯调用第三方接口爱番番进行开发</td>
</tr>
<tr>
<td>岗位职责：主要负责项目的搭建，页面布局和数据的渲染，对页面进行布局划分封装自定义组件，进行组件化开发，实现代码复用</td>
</tr>
<tr>
<td>技术要求：<br/>1、运用 nuxt.js 框架开发，采用前后端分离开发模式，使用element-ui 组件库进行页面的布局<br/>2、运用了 vuex、cookie 等对数据进行存储，axios 请求库与后台接口对接，进行数据交互<br/>3、运用了 less 等 css 预处理语言，提升了代码的简洁性和可读性<br/>4、运用了第三方插件 swiper、i18n 及即时通讯 IM 进行开发，实现了国际化与客服聊天等功能<br/></td>
</tr>
</tbody>
</table>
</div>
<h1 id="宝宝体征监测-小程序"><a href="#宝宝体征监测-小程序" class="headerlink" title="宝宝体征监测(小程序)"></a>宝宝体征监测(小程序)</h1><div class="table-container">
<table>
<thead>
<tr>
<th>2022/1-2022/2</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：平行镜（武汉）科技有限公司</td>
</tr>
<tr>
<td>项目描述：宝宝体征监测是一个检测宝宝的线上小程序，可以通过搜索名称或扫码进入小程序进行使用，用户可以在小程序中使用蓝牙连接设备观察宝宝是否尿床，温度湿度等情况。该项目是以uni-app框架为背景开发的，主要用到的一些api在uni-app官网下都可以查阅到的。项目主要涉及到的功能有:wifi、蓝牙、扫码、分享等</td>
</tr>
<tr>
<td>责任描述：<br/>1.使用HbuilderX编辑工具，搭配uni-app组件库编写页面，在微信开发者工具上进行视图调试； <br/>2.调用uni-app中的内置api获取用户登录授权信息，保存到本地，并对用户个人中心进行动态渲染； <br/>3.使用tabBar实现底部tab栏；<br/>4.点击开始检测时打开webscoket,如果遇到异常的数据就会发出警告,告诉家人宝宝有可能温度偏高或尿床了； <br/>5.修改预警信息,最高体温以及最低体温，如果超出就会预警，以及24小时内的曲线图报告和所有的历史记录；</td>
</tr>
</tbody>
</table>
</div>
<h1 id="圭峰山官网-与-后台管理系统"><a href="#圭峰山官网-与-后台管理系统" class="headerlink" title="圭峰山官网 与 后台管理系统"></a>圭峰山官网 与 后台管理系统</h1><div class="table-container">
<table>
<thead>
<tr>
<th>项目描述：项目介绍：圭峰山风景名胜区！圭峰山是广东十大名山之一，有着得天独厚的自然生态风光和深厚的历史人文文化积淀，集森林奇山风光、绿色生态、历史和宗教文化、寻古探幽、休闲度假、健身娱乐、旅游观光于一体，先后被评为广东省首批风景名胜区、国家森林公园和AAAA 级旅游区。</th>
</tr>
</thead>
<tbody>
<tr>
<td>负责模块：轮播图模块，留言模块，响应式模块，搜索模块，多语言模块，后台管理系<br/>统技术栈： <br/>1．使用 vue 全家桶进行开发 <br/>2．使用 vue-i18n 进行多语言的模块开发 <br/>3．使用 element-ui 进行组件的模块化开发 <br/>4．使用 postcss-px-to-viewport 与 C3 的@media 进行响应式的开发 <br/>5．使用 axios 对搜索模块和留言模块开发</td>
</tr>
</tbody>
</table>
</div>
<h1 id="Iot管理员面板"><a href="#Iot管理员面板" class="headerlink" title="Iot管理员面板"></a>Iot管理员面板</h1><div class="table-container">
<table>
<thead>
<tr>
<th>技术栈：React + GatsbyJS + Ant Design + TypeScript + ECharts</th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：广州逗号生活科技有限公司</td>
</tr>
<tr>
<td>项目描述：用亍管理设备和用户信息的后台系统<br/>职责描述： 在项目中主要负责修复系统缺陷及新功能模块的开发。 <br/>处理升级到 webpack5 出现的部分第三方库无法使用的问题。 <br/>负责项目性能优化，对加载时间过长的页面进行分析处理，根据情况对网络、包体积、缓存、图片等方面进行优化，优化后页面加载更快。 <br/>对Ant Design 上传组件进行二次封装，自劢转换为对象存储服务器需要的格式。 <br/>处理表格数据导出，封装导出表格数据为 csv 文件的方法。 <br/>根据实际需求情况封装 ECharts 组件，对用到的图表单独进行封装成组件，提高 开发效率。 <br/>通过配置webpack使用Babel + tsc的形式来引入TypeScript语法支持，减少转换流程，提升开发效率</td>
</tr>
</tbody>
</table>
</div>
<h1 id="coupon后台管理系统"><a href="#coupon后台管理系统" class="headerlink" title="coupon后台管理系统"></a>coupon后台管理系统</h1><div class="table-container">
<table>
<thead>
<tr>
<th>作品地址：<a target="_blank" rel="noopener" href="http://manage.electricbike.coupons">http://manage.electricbike.coupons</a></th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：广州加德智能科技有限公司</td>
</tr>
<tr>
<td>项目描述：该项目用于coupon网站产品的更新、新闻发布客户信息等功能管理 <br/>项目使用vue+vue-router+xuex+element-ui <br/>责任描述： <br/>1.独立负责整个项目，具体功能有登录、首页分析、富文本、图片管理、产品增删改查、权限设置等 <br/>2.登录页：用于用户登录，以及权限校验功能，使用beforeEach路由守卫判断用户的操作权限 <br/>3.首页分析：使用Apache Echarts做流量统计，可选过往日期进行数据对比 <br/>4.引入ueditor富文本做为后台输入文本，可供管理人员操作以及嵌入html <br/>5.所有页面数据使用axios请求获取数据，实现数据实时更新</td>
</tr>
</tbody>
</table>
</div>
<h1 id="奇速管理系统"><a href="#奇速管理系统" class="headerlink" title="奇速管理系统"></a>奇速管理系统</h1><div class="table-container">
<table>
<thead>
<tr>
<th>10000-11000元/月 3年</th>
</tr>
</thead>
<tbody>
<tr>
<td>项目描述：本项目是一个内部送货系统,为公司配送人员提供订单管理和客户信息管理的操作服务,包含 我的客户、客户关怀、消息中心、物流单,快提单、登录、个人中心等模块。 <br/>技术架构:Vue、VantUI框架 <br/>技术要点:<br/>1、通过 axios 来实现对数据的请求,简化代码,同时使用拦截器, <br/>2、使用VueX实现存储用户信息,减少请求次数 <br/>3、使用时间戳formatDate对用户进行按时间排序 <br/>4、首屏数据请求提前加载,非首屏的资源采用异步加载的模式 <br/>5、调用router.addRoute()方法,匹配vuex中权限数据,动态添加路由 <br/>6、利用preload,prefetch,preconnect属性我们可以在 内部书写资源获取请求</td>
</tr>
</tbody>
</table>
</div>
<h1 id="云辉旅游官方商城"><a href="#云辉旅游官方商城" class="headerlink" title="云辉旅游官方商城"></a>云辉旅游官方商城</h1><div class="table-container">
<table>
<thead>
<tr>
<th>所属公司：广州天腾云计算机网络科技有限公司</th>
</tr>
</thead>
<tbody>
<tr>
<td>项目简介：该项目是一款四川云阳景区，查看当地酒店、旅游景区、门票价格等服务为游客提供优质的旅游攻略服务  <br/>项目技术栈：React、MUI、axios、TypeScript <br/>个人职责: <br/>1 根据设计图一比一还原设计稿，完成基础页面的搭建，完成响应式布局 <br/>2 与后台工程师协作，完成数据交互、动态展现 <br/>3 负责登录、首页、个人中心以及酒店详情页  <br/>技术要点： <br/>1 使用 TS 编译代码，静态校验代码规范，便于后续进行管理和维护<br/>2 使用 React.lazy 完成路由的懒加载以及配合使用 Suspense 使用 Loding <br/>3 查看受保护页，未登录跳转登录，登录完成重定向回受保护页面 <br/>4 使用 fastclick 解决移动端点击延迟300ms的问题 5 使用 less 预处理语言书写页面样式以及使用:deep()解决框架样式问题<br/>5 使用防抖优化输入框实时输入请求事件以及节流优化内容加载<br/>6 调用微信支付接口，获取用户的 AppID,实现支付的金额参数与用户展示余额相绑定等功能<br/>7 利用临时存储解决Vuex数据丢失的问题<br/>8 使用路由懒加载解决白屏问题，提高用户体验<br/></td>
</tr>
</tbody>
</table>
</div>
<h1 id="全过程工程咨询管理系"><a href="#全过程工程咨询管理系" class="headerlink" title="全过程工程咨询管理系"></a>全过程工程咨询管理系</h1><div class="table-container">
<table>
<thead>
<tr>
<th>所属公司：广东舍卫工程技术咨询有限公司</th>
</tr>
</thead>
<tbody>
<tr>
<td>项目技术：<br/>基本的 Vue、ElementUI、Vue-cli、SCSS、JavaScript、Es6、Vxe-table、vxe-virtual-tree、Axios、js-xlsx、xlsx-style；<br/>使用 Vuex 结合 cookie 对 toke 数据信息存储，多次重复获取使用，浏览器刷新时则需要判断token是否过期，是否重新获取 token，同时使用 session 存储基本用户信息，浏览器刷新或每隔定时器一段时间重新获取在存储；<br/>使用 Antv G6 绘制横向树结构图；<br/>使用 Antv X6 绘制流程图；<br/>通过 iframe 结合 office 官方提供连接进行 office 文件在线预览，通过pdf.js 实现页面中在线预览pdf文件，对其进行了封装；<br/>项目简介：<br/>该项目主要用于工程方面对所有流程过程中资料文件管理，审核发起，数据填写进行统一，用户无需具备专业的工程知识即可进行相关操作，通过导入文档获取标题、流程等相关数据，绘制横向树结构图进行整体数据查看，点击跳转到对应项进行数据填写，发起审核，一步一步完成业务流程，还可以自定义组织架构图，导出架构图。</td>
</tr>
</tbody>
</table>
</div>
<div class="table-container">
<table>
<thead>
<tr>
<th><strong>广东政务服务网—好差评项目(web)</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td>所属公司：天讯瑞达通信技术有限公司</td>
</tr>
<tr>
<td>项目描述：该项目是广东政务网的政务类项目，主要通过政务服务能力监督，通过公开公示的部门和事项服务数据，促进政府部门做好 服务工作。 包含基础指标管理、测评月报、测评报告、异常监督、事项检测等模块，并且对省内各地市进行定制化开发 <br/>项目构成：公众端（面向用户） + 政务端（后台系统） <br/>公众端（web）：（<a target="_blank" rel="noopener" href="https://www.gdzwfw.gov.cn/ping/）">https://www.gdzwfw.gov.cn/ping/）</a> <br/>1、采用 vue 框架 + Antd组件库 + vuex 构建 <br/>2、根据原型图搭建静态页面，处理好移动端和浏览器的兼容性问题； <br/>3、使用vuex实现组件间常用数据传递和操作方法、axios实现前后台数据交互； <br/>4、封装公共组件，加强组件的可共用性； <br/>5、通过@media 媒体查询，实现多端兼容（移动端+pc端+ 横/竖屏评价器）</td>
</tr>
</tbody>
</table>
</div>
<h1 id="哈利波特官网以及预热h5活动页"><a href="#哈利波特官网以及预热h5活动页" class="headerlink" title="哈利波特官网以及预热h5活动页"></a>哈利波特官网以及预热h5活动页</h1><div class="table-container">
<table>
<thead>
<tr>
<th>使用技术栈：FIS3、Less、JQ、TS、Velocity 、createjs</th>
</tr>
</thead>
<tbody>
<tr>
<td>项目描述：哈利波特前三个版本的官网、h5活动页、邀请页。在项目中对不同需求进行需求分析、技术选型、页面制作；其中h5活动页为动画类型的页面，使用视频、createjs+an以及序列帧等方式进行动画制作；官网为强seo类型页面使用混编的方式制作。</td>
</tr>
</tbody>
</table>
</div>
<h1 id="汇英人才招聘网（PC端）https-www-huihr-com"><a href="#汇英人才招聘网（PC端）https-www-huihr-com" class="headerlink" title="汇英人才招聘网（PC端）https://www.huihr.com/"></a>汇英人才招聘网（PC端）<a target="_blank" rel="noopener" href="https://www.huihr.com/">https://www.huihr.com/</a></h1><div class="table-container">
<table>
<thead>
<tr>
<th>所属公司：茂名鼎悦科技有限公司</th>
</tr>
</thead>
<tbody>
<tr>
<td>项目描述：<br/>人才招聘网，以网络为媒体癿招聘广告发布平台及相关癿人力资源服务系统；<br/>为企业为求职者提供人才网招聘信息平台，具有方便以人才交流、人事代理两大业务体系为主体，人事代理服务、人<br/>才网信息服务、人才输送流劢性强，速度更快更便捷，传播面广。<br/>使用技术：<br/>axios (请求接口)<br/>vue-router (单页路由)<br/>vuex (状态管理)<br/>vuex-persistedstate (vuex 数据持久化)<br/>normalize.css (初始化样式)<br/>项 目 经 历&lt;br/&gt;@vueuse/core (组合 api 常用工具库)<br/>dayjs (日期处理)<br/>vee-validate （表单校验）<br/>项目职责：<br/>首页模块、类型分类：无限加载、职位详情展示、申请队列、登录模块、填写信息、进行支付、个人中心<br/>基本配置：<br/>使用axios请求后端服务器使用token完成<br/>验证登录功能<br/>使用Vue内置癿filter注册全局过滤器，处理服务端返回时数据丌规范癿处理<br/>使用less癿自劢化导入、组件化公用模块<br/>业务<br/>1-首页<br/>mockjs模拟数据+骨架屏+数据懒加载+图片懒加载+轮播图组件，通过vue3@vueuse/core癿组件数据<br/>懒加载useIntersectionObserver和IntersectionObserver封装组件数据懒加载和图片懒加载。<br/>2-职位模块<br/>复选框组件+面包屑组件+无限加载组件，使用揑槽和封装选项组件完成面包屑组件，render 选项，h<br/>凼数 癿基本使用。<br/>通过 render 渲染，h 凼数封装面包屑功能，tx-infinite-loading 完成数据加载和渲染</td>
</tr>
</tbody>
</table>
</div>
<p><strong>项目名称:360场景管理系统</strong></p>
<p><strong>项目职责：</strong></p>
<p>1、场景信息维护:包括360全景场景名称、场景描述、场景音乐等信息和数据的维护,为场景导航提供数据;</p>
<p>2、热点信息维护:包括360全景热区名称及描述信息、热区相关文字、图片、音频、视频等信息的维护,还包括在地图导览标记热区位置功能；</p>
<p>3、展品或热点信息维护:包括360全景展品或信息维护,包括名称、文字、图片、音频、视频等信息的维护. </p>
<p><strong>项目描述：</strong></p>
<p>该项目是使用 vue3.0配合three.js跟Element 开发的，将前端从360场景管理的工作中解放了出来。</p>
</article><div class="post-copyright"><div class="post-copyright__author"><span class="post-copyright-meta">文章作者: </span><span class="post-copyright-info"><a href="mailto:undefined">ZhuoRu</a></span></div><div class="post-copyright__type"><span class="post-copyright-meta">文章链接: </span><span class="post-copyright-info"><a href="https://zhangzhuoru.gitee.io/web/post/1666.html">https://zhangzhuoru.gitee.io/web/post/1666.html</a></span></div><div class="post-copyright__notice"><span class="post-copyright-meta">版权声明: </span><span class="post-copyright-info">本博客所有文章除特别声明外，均采用 <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">CC BY-NC-SA 4.0</a> 许可协议。转载请注明来自 <a href="https://zhangzhuoru.gitee.io/web" target="_blank">前端攻城狮ZhuoRu</a>！</span></div></div><div class="tag_share"><div class="post-meta__tag-list"><a class="post-meta__tags" href="/web/tags/%E4%BC%98%E7%A7%80%E7%AE%80%E5%8E%86/">优秀简历</a></div><div class="post_share"><div class="social-share" data-image="/web/img/tab4.png" data-sites="facebook,twitter,wechat,weibo,qq"></div><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/social-share.js/dist/css/share.min.css" media="print" onload="this.media='all'"><script src="https://cdn.jsdelivr.net/npm/social-share.js/dist/js/social-share.min.js" defer></script></div></div><div class="post-reward"><div class="reward-button button--animated"><i class="fas fa-qrcode"></i> 打赏</div><div class="reward-main"><ul class="reward-all"><li class="reward-item"><a href="/web/./img/wechat.png" target="_blank"><img class="post-qr-code-img" data-lazy-src="/web/./img/wechat.png" alt="微信"/></a><div class="post-qr-code-desc">微信</div></li><li class="reward-item"><a href="/web/./img/alipay.jpg" target="_blank"><img class="post-qr-code-img" data-lazy-src="/web/./img/alipay.jpg" alt="支付寶"/></a><div class="post-qr-code-desc">支付寶</div></li></ul></div></div><nav class="pagination-post" id="pagination"><div class="prev-post pull-left"><a href="/web/post/1026.html"><img class="prev-cover" data-lazy-src="/web/img/tab99.png" onerror="onerror=null;src='/web/img/404.jpg'" alt="cover of previous post"><div class="pagination-info"><div class="label">上一篇</div><div class="prev_info">Vue3学习总结</div></div></a></div><div class="next-post pull-right"><a href="/web/post/1024.html"><img class="next-cover" data-lazy-src="/web/img/tab2.png" onerror="onerror=null;src='/web/img/404.jpg'" alt="cover of next post"><div class="pagination-info"><div class="label">下一篇</div><div class="next_info">话费充值平台总结</div></div></a></div></nav><hr/><div id="post-comment"><div class="comment-head"><div class="comment-headline"><i class="fas fa-comments fa-fw"></i><span> 评论</span></div></div><div class="comment-wrap"><div><div id="twikoo-wrap"></div></div></div></div></div><div class="aside-content" id="aside-content"><div class="card-widget card-info"><div class="card-info-avatar is-center"><img class="avatar-img" data-lazy-src="https://thirdqq.qlogo.cn/g?b=sdk&amp;nk=2276839311&amp;s=140" onerror="this.onerror=null;this.src='/web/img/friend_404.gif'" alt="avatar"/><div class="author-info__name">ZhuoRu</div><div class="author-info__description"></div></div><div class="card-info-data"><div class="card-info-data-item is-center"><a href="/web/archives/"><div class="headline">文章</div><div class="length-num">8</div></a></div><div class="card-info-data-item is-center"><a href="/web/tags/"><div class="headline">标签</div><div class="length-num">9</div></a></div><div class="card-info-data-item is-center"><a href="/web/categories/"><div class="headline">分类</div><div class="length-num">5</div></a></div></div><a class="button--animated" id="card-info-btn" target="_blank" rel="noopener" href="https://github.com/WebZhuoRu"><i class="fab fa-github"></i><span>Follow Me</span></a><div class="card-info-social-icons is-center"><a class="social-icon" href="https://github.com/WebZhuoRu" target="_blank" title="Github"><i class="fab fa-github"></i></a><a class="social-icon" href="mailto:2276839311@qq.com" target="_blank" title="Email"><i class="fas fa-envelope"></i></a><a class="social-icon" href="https://webzhuoru.github.io/" target="_blank" title="博客"><i class="fa-solid fa-book-skull"></i></a></div></div><div class="card-widget card-announcement"><div class="item-headline"><i class="fas fa-bullhorn card-announcement-animation"></i><span>公告</span></div><div class="announcement_content">This is my Blog</div></div><div class="sticky_layout"><div class="card-widget" id="card-toc"><div class="item-headline"><i class="fas fa-stream"></i><span>目录</span></div><div class="toc-content"><ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#%E9%A9%AC%E8%B8%8F%E4%BC%98%E9%80%89"><span class="toc-number">1.</span> <span class="toc-text">马踏优选</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%90%AF%E6%9E%9C%E6%9E%9C%E5%90%8E%E5%8F%B0%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9F"><span class="toc-number">2.</span> <span class="toc-text">启果果后台管理系统</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%B0%8F%E5%85%94%E9%B2%9C%E5%84%BF"><span class="toc-number">3.</span> <span class="toc-text">小兔鲜儿</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%B8%82%E5%9C%BA%E6%91%8A%E4%BD%8D%E7%AE%A1%E7%90%86%E5%90%8E%E5%8F%B0%E7%B3%BB%E7%BB%9F"><span class="toc-number">4.</span> <span class="toc-text">市场摊位管理后台系统</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E4%B8%AA%E4%BA%BA%E4%BC%98%E5%8A%BF%EF%BC%9A"><span class="toc-number">5.</span> <span class="toc-text">个人优势：</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E4%BC%8A%E5%AE%B6%E6%B0%91%E5%AE%BF%E5%90%8E%E5%8F%B0%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9F"><span class="toc-number">6.</span> <span class="toc-text">伊家民宿后台管理系统</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%86%92%E4%B8%AA%E6%B3%A1%E6%97%85%E8%A1%8C"><span class="toc-number">7.</span> <span class="toc-text">冒个泡旅行</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E6%80%A5%E6%97%B6%E9%B2%9C%E9%85%8D%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9F"><span class="toc-number">8.</span> <span class="toc-text">急时鲜配管理系统</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E4%B9%90%E5%AE%B6%E5%9B%AD%E7%89%A9%E4%B8%9A%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9F"><span class="toc-number">9.</span> <span class="toc-text">乐家园物业管理系统</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E6%8B%94%E8%8D%89%E8%B4%AD-App"><span class="toc-number">10.</span> <span class="toc-text">拔草购-App</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E6%AF%8D%E5%A9%B4%E8%B4%AD"><span class="toc-number">11.</span> <span class="toc-text">母婴购</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%90%A5%E9%94%80%E5%85%AC%E7%A4%BE"><span class="toc-number">12.</span> <span class="toc-text">营销公社</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#Italk"><span class="toc-number">13.</span> <span class="toc-text">Italk</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E7%82%BC%E5%B0%8F%E9%98%9FCRM"><span class="toc-number">14.</span> <span class="toc-text">炼小队CRM</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E4%B8%AD%E6%9D%90%E5%AE%98%E7%BD%91"><span class="toc-number">15.</span> <span class="toc-text">中材官网</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%AE%9D%E5%AE%9D%E4%BD%93%E5%BE%81%E7%9B%91%E6%B5%8B-%E5%B0%8F%E7%A8%8B%E5%BA%8F"><span class="toc-number">16.</span> <span class="toc-text">宝宝体征监测(小程序)</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%9C%AD%E5%B3%B0%E5%B1%B1%E5%AE%98%E7%BD%91-%E4%B8%8E-%E5%90%8E%E5%8F%B0%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9F"><span class="toc-number">17.</span> <span class="toc-text">圭峰山官网 与 后台管理系统</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#Iot%E7%AE%A1%E7%90%86%E5%91%98%E9%9D%A2%E6%9D%BF"><span class="toc-number">18.</span> <span class="toc-text">Iot管理员面板</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#coupon%E5%90%8E%E5%8F%B0%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9F"><span class="toc-number">19.</span> <span class="toc-text">coupon后台管理系统</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%A5%87%E9%80%9F%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9F"><span class="toc-number">20.</span> <span class="toc-text">奇速管理系统</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E4%BA%91%E8%BE%89%E6%97%85%E6%B8%B8%E5%AE%98%E6%96%B9%E5%95%86%E5%9F%8E"><span class="toc-number">21.</span> <span class="toc-text">云辉旅游官方商城</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%85%A8%E8%BF%87%E7%A8%8B%E5%B7%A5%E7%A8%8B%E5%92%A8%E8%AF%A2%E7%AE%A1%E7%90%86%E7%B3%BB"><span class="toc-number">22.</span> <span class="toc-text">全过程工程咨询管理系</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%93%88%E5%88%A9%E6%B3%A2%E7%89%B9%E5%AE%98%E7%BD%91%E4%BB%A5%E5%8F%8A%E9%A2%84%E7%83%ADh5%E6%B4%BB%E5%8A%A8%E9%A1%B5"><span class="toc-number">23.</span> <span class="toc-text">哈利波特官网以及预热h5活动页</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E6%B1%87%E8%8B%B1%E4%BA%BA%E6%89%8D%E6%8B%9B%E8%81%98%E7%BD%91%EF%BC%88PC%E7%AB%AF%EF%BC%89https-www-huihr-com"><span class="toc-number">24.</span> <span class="toc-text">汇英人才招聘网（PC端）https:&#x2F;&#x2F;www.huihr.com&#x2F;</span></a></li></ol></div></div><div class="card-widget card-recent-post"><div class="item-headline"><i class="fas fa-history"></i><span>最新文章</span></div><div class="aside-list"><div class="aside-list-item"><a class="thumbnail" href="/web/post/1026.html" title="Vue3学习总结"><img data-lazy-src="/web/img/tab99.png" onerror="this.onerror=null;this.src='/web/img/404.jpg'" alt="Vue3学习总结"/></a><div class="content"><a class="title" href="/web/post/1026.html" title="Vue3学习总结">Vue3学习总结</a><time datetime="2022-11-26T16:31:04.834Z" title="发表于 2022-11-27 00:31:04">2022-11-27</time></div></div><div class="aside-list-item"><a class="thumbnail" href="/web/post/1666.html" title="个人简历大全 😘"><img data-lazy-src="/web/img/tab4.png" onerror="this.onerror=null;this.src='/web/img/404.jpg'" alt="个人简历大全 😘"/></a><div class="content"><a class="title" href="/web/post/1666.html" title="个人简历大全 😘">个人简历大全 😘</a><time datetime="2022-11-26T16:31:04.810Z" title="发表于 2022-11-27 00:31:04">2022-11-27</time></div></div><div class="aside-list-item"><a class="thumbnail" href="/web/post/1024.html" title="话费充值平台总结"><img data-lazy-src="/web/img/tab2.png" onerror="this.onerror=null;this.src='/web/img/404.jpg'" alt="话费充值平台总结"/></a><div class="content"><a class="title" href="/web/post/1024.html" title="话费充值平台总结">话费充值平台总结</a><time datetime="2022-11-26T16:31:04.798Z" title="发表于 2022-11-27 00:31:04">2022-11-27</time></div></div><div class="aside-list-item"><a class="thumbnail" href="/web/post/16106.html" title="填坑录"><img data-lazy-src="/web/img/tab99.png" onerror="this.onerror=null;this.src='/web/img/404.jpg'" alt="填坑录"/></a><div class="content"><a class="title" href="/web/post/16106.html" title="填坑录">填坑录</a><time datetime="2022-11-26T16:31:04.787Z" title="发表于 2022-11-27 00:31:04">2022-11-27</time></div></div><div class="aside-list-item"><a class="thumbnail" href="/web/post/11314.html" title="uniapp开发,遇坑填坑 😘"><img data-lazy-src="/web/img/tab5.png" onerror="this.onerror=null;this.src='/web/img/404.jpg'" alt="uniapp开发,遇坑填坑 😘"/></a><div class="content"><a class="title" href="/web/post/11314.html" title="uniapp开发,遇坑填坑 😘">uniapp开发,遇坑填坑 😘</a><time datetime="2022-11-26T16:31:04.746Z" title="发表于 2022-11-27 00:31:04">2022-11-27</time></div></div><div class="aside-list-item"><a class="thumbnail" href="/web/post/16107.html" title="Butterfly启动说明书"><img data-lazy-src="/web/img/tab6.png" onerror="this.onerror=null;this.src='/web/img/404.jpg'" alt="Butterfly启动说明书"/></a><div class="content"><a class="title" href="/web/post/16107.html" title="Butterfly启动说明书">Butterfly启动说明书</a><time datetime="2022-11-26T16:31:04.729Z" title="发表于 2022-11-27 00:31:04">2022-11-27</time></div></div></div></div></div></div></main><footer id="footer" style="background-image: url('/web/img/tab4.png')"><div id="footer-wrap"><div class="copyright">&copy;2019 - 2022 By ZhuoRu</div><div class="footer_custom_text">I wish you to become your own sun, no need to rely on who's light.<p><a target="_blank" href="https://hexo.io/"><img src="https://img.shields.io/badge/Frame-Hexo-blue?style=flat&logo=hexo" title="博客框架为Hexo"></a>&nbsp;<a target="_blank" href="https://butterfly.js.org/"><img src="https://img.shields.io/badge/Theme-Butterfly-6513df?style=flat&logo=bitdefender" title="主题采用butterfly"></a>&nbsp;<a target="_blank" href="https://www.jsdelivr.com/"><img src="https://img.shields.io/badge/CDN-jsDelivr-orange?style=flat&logo=jsDelivr" title="本站使用JsDelivr为静态资源提供CDN加速"></a> &nbsp;<a target="_blank" href="https://vercel.com/ "><img src="https://img.shields.io/badge/Hosted-Vervel-brightgreen?style=flat&logo=Vercel" title="本站采用双线部署，默认线路托管于Vercel"></a>&nbsp;<a target="_blank" href="https://vercel.com/ "><img src="https://img.shields.io/badge/Hosted-Coding-0cedbe?style=flat&logo=Codio" title="本站采用双线部署，联通线路托管于Coding"></a>&nbsp;<a target="_blank" href="https://github.com/"><img src="https://img.shields.io/badge/Source-Github-d021d6?style=flat&logo=GitHub" title="本站项目由Gtihub托管"></a>&nbsp;<a target="_blank" href="http://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="https://img.shields.io/badge/Copyright-BY--NC--SA%204.0-d42328?style=flat&logo=Claris" title="本站采用知识共享署名-非商业性使用-相同方式共享4.0国际许可协议进行许可"></a></p></div></div></footer></div><div id="rightside"><div id="rightside-config-hide"><button id="readmode" type="button" title="阅读模式"><i class="fas fa-book-open"></i></button><a class="icon-V hidden" onclick="switchNightMode()" title="浅色和深色模式转换"><svg width="25" height="25" viewBox="0 0 1024 1024"><use id="modeicon" xlink:href="#icon-moon"></use></svg></a><button id="hide-aside-btn" type="button" title="单栏和双栏切换"><i class="fas fa-arrows-alt-h"></i></button></div><div id="rightside-config-show"><button id="rightside_config" type="button" title="设置"><i class="fas fa-cog fa-spin"></i></button><button class="close" id="mobile-toc-button" type="button" title="目录"><i class="fas fa-list-ul"></i></button><a id="to_comment" href="#post-comment" title="直达评论"><i class="fas fa-comments"></i></a><button id="go-up" type="button" title="回到顶部"><i class="fas fa-arrow-up"></i></button></div></div><div id="local-search"><div class="search-dialog"><div class="search-dialog__title" id="local-search-title">本地搜索</div><div id="local-input-panel"><div id="local-search-input"><div class="local-search-box"><input class="local-search-box--input" placeholder="搜索文章" type="text"/></div></div></div><hr/><div id="local-search-results"></div><span class="search-close-button"><i class="fas fa-times"></i></span></div><div id="search-mask"></div></div><div><script src="/web/js/utils.js"></script><script src="/web/js/main.js"></script><script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload/dist/lazyload.iife.min.js"></script><script src="https://cdn.jsdelivr.net/npm/node-snackbar/dist/snackbar.min.js"></script><script src="/web/js/search/local-search.js"></script><script>var preloader = {
  endLoading: () => {
    document.body.style.overflow = 'auto';
    document.getElementById('loading-box').classList.add("loaded")
  },
  initLoading: () => {
    document.body.style.overflow = '';
    document.getElementById('loading-box').classList.remove("loaded")

  }
}
window.addEventListener('load',preloader.endLoading())</script><div class="js-pjax"><script>(()=>{
  const $countDom = document.getElementById('twikoo-count')
  const init = () => {
    twikoo.init(Object.assign({
      el: '#twikoo-wrap',
      envId: 'https://wechat-delta.vercel.app/',
      region: 'ap-guangzhou'
    }, null))
  }

  const getCount = () => {
    twikoo.getCommentsCount({
      envId: 'https://wechat-delta.vercel.app/',
      region: 'ap-guangzhou',
      urls: [window.location.pathname],
      includeReply: false
    }).then(function (res) {
      $countDom.innerText = res[0].count
    }).catch(function (err) {
      console.error(err);
    });
  }

  const loadTwikoo = (bool = false) => {
    if (typeof twikoo === 'object') {
      init()
      bool && $countDom && setTimeout(getCount,0)
    } else {
      getScript('https://cdn.jsdelivr.net/npm/twikoo/dist/twikoo.all.min.js').then(()=> {
        init()
        bool && $countDom && setTimeout(getCount,0)
      })
    }
  }

  if ('Twikoo' === 'Twikoo' || !true) {
    if (true) btf.loadComment(document.getElementById('twikoo-wrap'), loadTwikoo)
    else loadTwikoo(true)
  } else {
    window.loadOtherComment = () => {
      loadTwikoo()
    }
  }
})()</script></div><canvas id="universe"></canvas><div class="aplayer no-destroy" data-id="7592292364" data-server="netease" data-type="playlist" data-fixed="true" data-autoplay="true" data-loop="all" data-lrctype="0"> </div><script defer src="https://npm.elemecdn.com/jquery@latest/dist/jquery.min.js"></script><script defer src="./js/universe.js"></script><script defer src="./js/sun_moon.js"></script><script defer src="https://fastly.jsdelivr.net/gh/graingert/wow@1.3.0/dist/wow.min.js"></script><script defer data-pjax src="/js/wow_init.js"></script><script defer src="https://fastly.jsdelivr.net/npm/hexo-theme-volantis@latest/source/js/issues.min.js"></script><canvas class="fireworks" mobile="false"></canvas><script src="https://cdn.jsdelivr.net/npm/butterfly-extsrc@1/dist/fireworks.min.js"></script><script src="https://cdn.jsdelivr.net/npm/butterfly-extsrc@1/dist/activate-power-mode.min.js"></script><script>POWERMODE.colorful = true;
POWERMODE.shake = false;
POWERMODE.mobile = false;
document.body.addEventListener('input', POWERMODE);
</script><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css" media="print" onload="this.media='all'"><script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script><script src="https://cdn.jsdelivr.net/gh/metowolf/MetingJS@1.2/dist/Meting.min.js"></script><script src="https://cdn.jsdelivr.net/npm/pjax/pjax.min.js"></script><script>let pjaxSelectors = [
  'title',
  '#config-diff',
  '#body-wrap',
  '#rightside-config-hide',
  '#rightside-config-show',
  '.js-pjax'
]

if (false) {
  pjaxSelectors.unshift('meta[property="og:image"]', 'meta[property="og:title"]', 'meta[property="og:url"]')
}

var pjax = new Pjax({
  elements: 'a:not([target="_blank"])',
  selectors: pjaxSelectors,
  cacheBust: false,
  analytics: false,
  scrollRestoration: false
})

document.addEventListener('pjax:complete', function () {
  window.refreshFn()

  document.querySelectorAll('script[data-pjax]').forEach(item => {
    const newScript = document.createElement('script')
    const content = item.text || item.textContent || item.innerHTML || ""
    Array.from(item.attributes).forEach(attr => newScript.setAttribute(attr.name, attr.value))
    newScript.appendChild(document.createTextNode(content))
    item.parentNode.replaceChild(newScript, item)
  })

  GLOBAL_CONFIG.islazyload && window.lazyLoadInstance.update()

  typeof chatBtnFn === 'function' && chatBtnFn()
  typeof panguInit === 'function' && panguInit()

  // google analytics
  typeof gtag === 'function' && gtag('config', '', {'page_path': window.location.pathname});

  // baidu analytics
  typeof _hmt === 'object' && _hmt.push(['_trackPageview',window.location.pathname]);

  typeof loadMeting === 'function' && document.getElementsByClassName('aplayer').length && loadMeting()

  // Analytics
  if (false) {
    MtaH5.pgv()
  }

  // prismjs
  typeof Prism === 'object' && Prism.highlightAll()

  typeof preloader === 'object' && preloader.endLoading()
})


document.addEventListener('pjax:send', function () {
  typeof preloader === 'object' && preloader.initLoading()
  
  if (window.aplayers) {
    for (let i = 0; i < window.aplayers.length; i++) {
      if (!window.aplayers[i].options.fixed) {
        window.aplayers[i].destroy()
      }
    }
  }

  typeof typed === 'object' && typed.destroy()

  //reset readmode
  const $bodyClassList = document.body.classList
  $bodyClassList.contains('read-mode') && $bodyClassList.remove('read-mode')

})

document.addEventListener('pjax:error', (e) => {
  if (e.request.status === 404) {
    pjax.loadUrl('/404.html')
  }
})</script><script async data-pjax src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script></div><!-- hexo injector body_end start --><script data-pjax>
  function butterfly_swiper_injector_config(){
    var parent_div_git = document.getElementById('recent-posts');
    var item_html = '<div class="recent-post-item" style="height: auto;width: 100%"><div class="blog-slider swiper-container-fade swiper-container-horizontal" id="swiper_container"><div class="blog-slider__wrp swiper-wrapper" style="transition-duration: 0ms;"><div class="blog-slider__item swiper-slide" style="width: 750px; opacity: 1; transform: translate3d(0px, 0px, 0px); transition-duration: 0ms;"><a class="blog-slider__img" onclick="pjax.loadUrl(&quot;post/1026.html&quot;);" href="javascript:void(0);" alt=""><img width="48" height="48" src="/img/tab99.png" alt="" onerror="this.src=https://unpkg.zhimg.com/akilar-candyassets/image/loading.gif; this.onerror = null;"/></a><div class="blog-slider__content"><span class="blog-slider__code">2022-11-27</span><a class="blog-slider__title" onclick="pjax.loadUrl(&quot;post/1026.html&quot;);" href="javascript:void(0);" alt="">Vue3学习总结</a><div class="blog-slider__text">前端内卷的开始,Vue3开发上手总结</div><a class="blog-slider__button" onclick="pjax.loadUrl(&quot;post/1026.html&quot;);" href="javascript:void(0);" alt="">详情       </a></div></div><div class="blog-slider__item swiper-slide" style="width: 750px; opacity: 1; transform: translate3d(0px, 0px, 0px); transition-duration: 0ms;"><a class="blog-slider__img" onclick="pjax.loadUrl(&quot;post/1038.html&quot;);" href="javascript:void(0);" alt=""><img width="48" height="48" src="/img/tab5.png" alt="" onerror="this.src=https://unpkg.zhimg.com/akilar-candyassets/image/loading.gif; this.onerror = null;"/></a><div class="blog-slider__content"><span class="blog-slider__code">2022-11-27</span><a class="blog-slider__title" onclick="pjax.loadUrl(&quot;post/1038.html&quot;);" href="javascript:void(0);" alt="">css学习总结</a><div class="blog-slider__text">课程目标:1. 学会使用CSS选择器2. 熟记CSS样式和外观属性3. 熟练掌握CSS各种选择器4. 熟练掌握CSS各种选择器5. 熟练掌握CSS三种显示模式6. 熟练掌握CSS背景属性7. 熟练掌握CSS三大特性8. 熟练掌握CSS盒子模型9. 熟练掌握CSS浮动10.熟练掌握CSS定位11.熟练掌握CSS高级技巧强化CSS</div><a class="blog-slider__button" onclick="pjax.loadUrl(&quot;post/1038.html&quot;);" href="javascript:void(0);" alt="">详情       </a></div></div><div class="blog-slider__item swiper-slide" style="width: 750px; opacity: 1; transform: translate3d(0px, 0px, 0px); transition-duration: 0ms;"><a class="blog-slider__img" onclick="pjax.loadUrl(&quot;post/16107.html&quot;);" href="javascript:void(0);" alt=""><img width="48" height="48" src="/img/tab6.png" alt="" onerror="this.src=https://unpkg.zhimg.com/akilar-candyassets/image/loading.gif; this.onerror = null;"/></a><div class="blog-slider__content"><span class="blog-slider__code">2022-11-27</span><a class="blog-slider__title" onclick="pjax.loadUrl(&quot;post/16107.html&quot;);" href="javascript:void(0);" alt="">Butterfly启动说明书</a><div class="blog-slider__text">启动说明书</div><a class="blog-slider__button" onclick="pjax.loadUrl(&quot;post/16107.html&quot;);" href="javascript:void(0);" alt="">详情       </a></div></div><div class="blog-slider__item swiper-slide" style="width: 750px; opacity: 1; transform: translate3d(0px, 0px, 0px); transition-duration: 0ms;"><a class="blog-slider__img" onclick="pjax.loadUrl(&quot;post/2020715.html&quot;);" href="javascript:void(0);" alt=""><img width="48" height="48" src="/img/tab2.png" alt="" onerror="this.src=https://unpkg.zhimg.com/akilar-candyassets/image/loading.gif; this.onerror = null;"/></a><div class="blog-slider__content"><span class="blog-slider__code">2022-11-27</span><a class="blog-slider__title" onclick="pjax.loadUrl(&quot;post/2020715.html&quot;);" href="javascript:void(0);" alt="">html学习总结</a><div class="blog-slider__text">学习目标:了解常用浏览器;掌握WEB标准;理解标签语义化;掌握常用的排版标签;掌握常用的文本格式化图像链接等标签;掌握三种列表标签;掌握表格标签;掌握表格标签;掌握表单标签</div><a class="blog-slider__button" onclick="pjax.loadUrl(&quot;post/2020715.html&quot;);" href="javascript:void(0);" alt="">详情       </a></div></div></div><div class="blog-slider__pagination swiper-pagination-clickable swiper-pagination-bullets"></div></div></div>';
    console.log('已挂载butterfly_swiper')
    parent_div_git.insertAdjacentHTML("afterbegin",item_html)
    }
  var elist = 'undefined'.split(',');
  var cpage = location.pathname;
  var epage = 'all';
  var flag = 0;

  for (var i=0;i<elist.length;i++){
    if (cpage.includes(elist[i])){
      flag++;
    }
  }

  if ((epage ==='all')&&(flag == 0)){
    butterfly_swiper_injector_config();
  }
  else if (epage === cpage){
    butterfly_swiper_injector_config();
  }
  </script><script defer src="https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper.min.js"></script><script defer data-pjax src="https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper_init.js"></script><script async src="//at.alicdn.com/t/font_2032782_8d5kxvn09md.js"></script><!-- hexo injector body_end end --></body></html>